import React, { Component } from "react";
import { Animated, Text, TextInput } from "react-native";
import View = Animated.View;

export default class PizzaTranslator extends Component<
  {},
  {
    text: string;
  }
> {
  state = {
    text: ""
  };

  render() {
    return (
      <View style={{ padding: 10 }}>
        <TextInput
          style={{ height: 40 }}
          placeholder={"Type here to translate"}
          onChangeText={text => this.setState({ text })}
        />
        <Text style={{ padding: 10, fontSize: 42 }}>
          {this.state.text.split(" ").join("🍕")}
        </Text>
      </View>
    );
  }
}
